<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=LyDLAdzhhgArwXN3B1oWnrHF7qz6gAv5"></script>
    <style>
        #mymap {
            width: 500px;
            height: 300px;
        }
    </style>
</head>
<body>
<input type="text" id="lng">
<input type="text" id="lat">
<div id="mymap"></div>
<script>
    var lngO = document.getElementById('lng');
    var latO = document.getElementById('lat');

    var map = new BMap.Map("mymap");
    var point = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(point, 15);

    var myIcon = new BMap.Icon("img/a.png", new BMap.Size(79, 110), {
// 指定定位位置。
// 当标注显示在地图上时，其所指向的地理位置距离图标左上
// 角各偏移10像素和25像素。您可以看到在本例中该位置即是
        // 图标中央下端的尖角位置。
        anchor: new BMap.Size(40, 110)
        // 设置图片偏移。
        // 当您需要从一幅较大的图片中截取某部分作为标注图标时，您
        // 需要指定大图的偏移位置，此做法与css sprites技术类似。
        //imageOffset: new BMap.Size(0, 25)   // 设置图片偏移
    });


    var marker = new BMap.Marker(point,{icon:myIcon});
    map.addOverlay(marker);


    map.addControl(new BMap.NavigationControl());
    map.addControl(new BMap.ScaleControl());
    map.addControl(new BMap.OverviewMapControl());
    map.addControl(new BMap.MapTypeControl());

    map.addEventListener('click',function(e){
        console.log(e.point);
        var marker = new BMap.Marker(e.point);
        map.addOverlay(marker);
        lng.value = e.point.lng;
        lat.value = e.point.lat;
//        alert('我被点击了')
    })

    //    window.setTimeout(function(){
//        map.panTo(new BMap.Point(116.409, 39.918));
//    }, 2000);
</script>
</body>
</html>